import React, { Component } from 'react'
import { Navigate, useNavigate } from 'react-router-dom'
import { fetchLogin } from '../../api'

export default class index extends Component {
  state = {
    username: '',
    password: '',
    loginFlag: false,
  }
  render() {
    return (
      <div>
        <span className="icon iconfont icon-shouye"></span>
        <div className="name">首页</div>
        账号：
        <input
          type="text"
          value={this.state.username}
          onChange={(e) => {
            this.setState({ username: e.target.value })
          }}
        />
        密码：
        <input
          type="text"
          value={this.state.password}
          onChange={(e) => {
            this.setState({ password: e.target.value })
          }}
        />
        <button
          onClick={() => {
            fetchLogin({ username: this.state.username, password: this.state.password }).then((res) => {
              console.log('res:', res)
              if (res.code === 0) {
                window.localStorage.setItem('token', res.data.token)
                this.setState({ loginFlag: true })
              }
            })
            // axios.post('/api/login', { username: this.state.username, password: this.state.password }).then((res) => {
            //   console.log('res:', res)
            //   if (res.data.code === 0) {
            //     window.localStorage.setItem('token', res.data.data.token)
            //     this.setState({ loginFlag: true })
            //   }
            // })
          }}
        >
          提交
        </button>
        {this.state.loginFlag ? <Navigate to={'/admin'}></Navigate> : null}
      </div>
    )
  }
}
